<template>
  <div>
    <div>
      <!--通道交易 表格区域 -->
      <a-table
        row-key="id"
        ref="TableInfo"
        :columns="columns"
        :rowKey="(record) => record.id"
        :dataSource="dataSource"
        :pagination="pagination"
        :loading="loading"
        :rowSelection="{
          selectedRowKeys: selectedRowKeys,
          onChange: onSelectChange,
        }"
        :scroll="{ x: 900 }"
        @change="handleTableChange"
      >
        <template slot="operation" slot-scope="text, record">
          <a-icon
            type="setting"
            theme="twoTone"
            twoToneColor="#4a9ff5"
            @click="edit(record)"
            title="修改"
          ></a-icon>
          <a-button size="small">停用</a-button>
          <a-button size="small">启用</a-button>
          <a-icon
            type="eye"
            theme="twoTone"
            twoToneColor="#42b983"
            @click="view(record)"
            title="查看"
          ></a-icon>
        </template>
      </a-table>
    </div>
    <!-- 详情 -->
    <p-dst-txn-auth-cfg-info
      ref="pDstTxnAuthCfgInfo"
      :pDstTxnAuthCfgInfoVisiable="pDstTxnAuthCfgInfo.visiable"
      @close="handlePDstTxnAuthCfgInfoClose"
    >
    </p-dst-txn-auth-cfg-info>
    <!-- 修改 -->
    <p-dst-txn-auth-cfg-edit
      ref="pDstTxnAuthCfgEdit"
      @close="handlePDstTxnAuthCfgEditClose"
      @success="handlePDstTxnAuthCfgEditSuccess"
      :pDstTxnAuthCfgEditVisiable="pDstTxnAuthCfgEdit.visiable"
    >
    </p-dst-txn-auth-cfg-edit>
  </div>
</template>

<script>
import RangeDate from "../../../../components/datetime/RangeDate";
import PDstTxnAuthCfgEdit from "./PDstTxnAuthCfgEdit";
import PDstTxnAuthCfgInfo from "./PDstTxnAuthCfgInfo";

export default {
  name: "PDstTxnAuthCfg",
  components: { PDstTxnAuthCfgEdit, PDstTxnAuthCfgInfo, RangeDate },
  data() {
    return {
      advanced: false,
      pDstTxnAuthCfgInfo: {
        visiable: false,
      },
      pDstTxnAuthCfgAdd: {
        visiable: false,
      },
      pDstTxnAuthCfgEdit: {
        visiable: false,
      },
      queryParams: {},
      filteredInfo: null,
      sortedInfo: null,
      paginationInfo: null,
      dataSource: [],
      selectedRowKeys: [],
      loading: false,
      pagination: {
        pageSizeOptions: ["10", "20", "30", "40", "100"],
        defaultCurrent: 1,
        defaultPageSize: 10,
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: (total, range) =>
          `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`,
      },
    };
  },
  computed: {
    columns() {
      let { sortedInfo, filteredInfo } = this;
      sortedInfo = sortedInfo || {};
      filteredInfo = filteredInfo || {};
      return [
        {
          title: "通道标识",
          dataIndex: "msgDstId",
          width: 100,
        },
        {
          title: "通道交易码",
          dataIndex: "channelTxn",
          width: 120,
        },
        {
          title: "通道交易描述",
          dataIndex: "txnName",
          width: 200,
        },
        {
          title: "通道交易费率模板",
          dataIndex: "channelTxnRate",
          width: 120,
        },
        {
          title: "交易支持标志",
          dataIndex: "supportFlag",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "Y":
                return "支持";
              case "N":
                return "不支持";
            }
          },
        },
        {
          title: "是否支持智能路由",
          dataIndex: "intelligentRouteFlag",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "Y":
                return "支持";
              case "N":
                return "不支持";
            }
          },
        },
        {
          title: "交易支持开始时间",
          dataIndex: "supportBeginTime",
          width: 200,
        },
        {
          title: "交易支持截止时间",
          dataIndex: "supportEndTime",
          width: 200,
        },
        {
          title: "支持账户类型",
          dataIndex: "supportAcctType",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "*":
                return "不分账户类型";
              case "01":
                return "本行借记账户";
              case "02":
                return "本行贷记账户";
              case "03":
                return "本行存折";
              case "04":
                return "本行内部户";
              case "10":
                return "他行借记账户";
              case "11":
                return "他行贷记账户";
              case "12":
                return "他行存折";
              case "13":
                return "他行内部户";
              case "20":
                return "借记账户";
              case "21":
                return "贷记账户";
            }
          },
        },
        {
          title: "交易延迟类型",
          dataIndex: "txnDelayType",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "1":
                return "实时到账";
              case "2":
                return "普通到账";
              case "3":
                return "24小时到账";
            }
          },
        },
        {
          title: "交易最大并发数",
          dataIndex: "maxSupportNum",
          width: 120,
        },
        {
          title: "业务报文登记标识",
          dataIndex: "msgRegisterFlag",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "Y":
                return "登记";
              case "N":
                return "不登记";
            }
          },
        },
        {
          title: "验签标志",
          dataIndex: "signFlag",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "Y":
                return "验签/MAC";
              case "N":
                return "不验签/MAC";
            }
          },
        },
        {
          title: "转加密标志",
          dataIndex: "pinFlag",
          width: 120,
          customRender: (text, row, index) => {
            switch (text) {
              case "Y":
                return "转加密";
              case "N":
                return "不转加密";
            }
          },
        },
        {
          title: "创建时间",
          dataIndex: "createTime",
          width: 120,
        },
        {
          title: "修改时间",
          dataIndex: "修改时间",
          width: 120,
        },
        {
          title: "操作",
          dataIndex: "operation",
          fixed: "right",
          scopedSlots: { customRender: "operation" },
        },
      ];
    },
  },
  mounted() {
    this.fetch();
  },
  methods: {
    onSelectChange(selectedRowKeys) {
      this.selectedRowKeys = selectedRowKeys;
    },
    toggleAdvanced() {
      this.advanced = !this.advanced;
      if (!this.advanced) {
        this.queryParams.createTimeFrom = "";
        this.queryParams.createTimeTo = "";
      }
    },
    add() {
      this.pDstTxnAuthCfgAdd.visiable = true;
    },
    handlePDstTxnAuthCfgAddClose() {
      this.pDstTxnAuthCfgAdd.visiable = false;
    },
    handlePDstTxnAuthCfgAddSuccess() {
      this.pDstTxnAuthCfgAdd.visiable = false;
      this.$message.success("新增成功");
      this.search();
    },
    view(record) {
      console.log(record);
      this.$refs.pDstTxnAuthCfgInfo.setFormValues(record);
      this.pDstTxnAuthCfgInfo.visiable = true;
    },
    edit(record) {
      this.$refs.pDstTxnAuthCfgEdit.setFormValues(record);
      this.pDstTxnAuthCfgEdit.visiable = true;
    },
    handlePDstTxnAuthCfgEditClose() {
      this.pDstTxnAuthCfgEdit.visiable = false;
    },
    handlePDstTxnAuthCfgEditSuccess() {
      this.pDstTxnAuthCfgEdit.visiable = false;
      this.$message.success("修改成功");
      this.search();
    },
    handlePDstTxnAuthCfgInfoClose() {
      this.pDstTxnAuthCfgInfo.visiable = false;
    },
    handleDeptChange(value) {
      this.queryParams.deptId = value || "";
    },
    handleDateChange(value) {
      if (value) {
        this.queryParams.createTimeFrom = value[0];
        this.queryParams.createTimeTo = value[1];
      }
    },
    batchDelete() {
      if (!this.selectedRowKeys.length) {
        this.$message.warning("请选择需要删除的记录");
        return;
      }
      let that = this;
      this.$confirm({
        title: "确定删除所选中的记录?",
        content: "当您点击确定按钮后，这些记录将会被彻底删除",
        centered: true,
        onOk() {
          let userIds = [];
          let selectedRowKeysStr = "," + that.selectedRowKeys.join(",") + ",";
          userIds.push(
            that.dataSource
              .filter((f) => {
                return selectedRowKeysStr.indexOf("," + f.userId + ",") > -1;
              })
              .map((m) => {
                return m.userId;
              })
          );
          that.$delete("user/" + userIds.join(",")).then(() => {
            that.$message.success("删除成功");
            that.selectedRowKeys = [];
            that.search();
          });
        },
        onCancel() {
          that.selectedRowKeys = [];
        },
      });
    },

    search() {
      let { sortedInfo, filteredInfo } = this;
      let sortField, sortOrder;
      // 获取当前列的排序和列的过滤规则
      if (sortedInfo) {
        sortField = sortedInfo.field;
        sortOrder = sortedInfo.order;
      }
      this.fetch({
        sortField: sortField,
        sortOrder: sortOrder,
        ...this.queryParams,
        ...filteredInfo,
      });
    },
    reset() {
      // 取消选中
      this.selectedRowKeys = [];
      // 重置分页
      this.$refs.TableInfo.pagination.current = this.pagination.defaultCurrent;
      if (this.paginationInfo) {
        this.paginationInfo.current = this.pagination.defaultCurrent;
        this.paginationInfo.pageSize = this.pagination.defaultPageSize;
      }
      // 重置列过滤器规则
      this.filteredInfo = null;
      // 重置列排序规则
      this.sortedInfo = null;
      // 重置查询参数
      this.queryParams = {};
      // 清空部门树选择
      this.$refs.deptTree.reset();
      // 清空时间选择
      if (this.advanced) {
        this.$refs.createTime.reset();
      }
      this.fetch();
    },
    handleTableChange(pagination, filters, sorter) {
      // 将这三个参数赋值给Vue data，用于后续使用
      this.paginationInfo = pagination;
      this.filteredInfo = filters;
      this.sortedInfo = sorter;

      this.userInfo.visiable = false;
      this.fetch({
        sortField: sorter.field,
        sortOrder: sorter.order,
        ...this.queryParams,
        ...filters,
      });
    },
    fetch(params = {}) {
      // 显示loading
      this.loading = true;
      if (this.paginationInfo) {
        // 如果分页信息不为空，则设置表格当前第几页，每页条数，并设置查询分页参数
        this.$refs.TableInfo.pagination.current = this.paginationInfo.current;
        this.$refs.TableInfo.pagination.pageSize = this.paginationInfo.pageSize;
        params.pageSize = this.paginationInfo.pageSize;
        params.pageNum = this.paginationInfo.current;
      } else {
        // 如果分页信息为空，则设置为默认值
        params.pageSize = this.pagination.defaultPageSize;
        params.pageNum = this.pagination.defaultCurrent;
      }
      //   this.$get("pDstTxnAuthCfgInfo", {
      //     ...params,
      //   }).then((r) => {
      //     let data = r.data;

      let data = {
        content: [
          {
            instId: "001",
            msgDstId: "UPAL",
            channelTxn: "aclose",
            supportFlag: "Y",
            intelligentRouteFlag: "Y",
            supportBeginTime: "*",
            supportEndTime: "*",
            supportAcctType: "*",
            txnDelayType: "1",
            maxSupportNum: 100,
            channelTxnRate: "FFES000076",
            msgRegisterFlag: "Y",
            signFlag: "Y",
            pinFlag: "N",
            txnName: "银联支付宝-关闭订单",
            createTime: "2020-10-01 00:00:00.000",
            updateTime: "2021-06-02 18:02:32.970",
            remark1: "",
            remark2: "",
            needSignFlag: "N",
            bizStartDate: null,
            chnlOptFlag: null,
            optFlag: null,
            bizTimeFlag: "N",
            supportAcctTypeList: null,
          },
        ],
        last: false,
        totalPages: 234,
        totalElements: 3506,
        first: true,
        numberOfElements: 2,
        sort: [
          {
            direction: "DESC",
            property: "id",
            ignoreCase: false,
            nullHandling: "NATIVE",
            ascending: false,
          },
        ],
        size: 2,
        number: 0,
      };
      const pagination = { ...this.pagination };
      pagination.total = data.size;
      this.dataSource = data.content;
      this.pagination = pagination;
      // 数据加载完毕，关闭loading
      this.loading = false;
      //   });
    },
  },
};
</script>
<style lang="less" scoped>
@import "../../../../../static/less/Common";
</style>
